<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>testMap</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
<script type="text/javascript" src="http://ditu.google.cn/maps/api/js?sensor=false&language=zh-CN"></script>
	<script type="text/javascript">
	

var map = null;
function initialize() {
	//初始地图中心点
	var myLatlng = new google.maps.LatLng(23.492 ,111.315);
	//地图属性
	var myOptions = {
		zoom: 11,
		streetViewControl:false,
		mapTypeId: google.maps.MapTypeId.ROADMAP,					//初始地图类型
		center: myLatlng,
		//disableDoubleClickZoom:true,
		scaleControl:true,
		maxZoom: 21,
		minZoom: 1,
		mapTypeControlOptions:{										//地图类型控件
		style:google.maps.MapTypeControlStyle.DEFAULT,
		position: google.maps.ControlPosition.TOP,
		mapTypeIds: [google.maps.MapTypeId.ROADMAP,google.maps.MapTypeId.SATELLITE]
		},    //地图类型种类
		navigationControlOptions:{									//缩放、拖动地图控件
			style:google.maps.NavigationControlStyle.ZOOM_PAN,
			position: google.maps.ControlPosition.TOP_RIGHT
		},
		scaleControlOptions:{										//显示地图比例控件
			style:google.maps.ScaleControlStyle.DEFAULT,
			position: google.maps.ControlPosition.BOTTOM_RIGHT
		}
	};
	//初始化地图DIV
	map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
	google.maps.event.addListener(map, 'idle', function(){
		
	});
	google.maps.event.addListener(map, 'click', function(event){
	});
	google.maps.event.addListener(map, 'zoom_changed', function(){
	});
	Marker();
}

var markerArr = [];
function Marker(){
	var center = map.getCenter();
	var latlng = null, marker = null;
	markerArr = [];
	for(var i = 0; i < 50; i++){
		latlng = new google.maps.LatLng(center.lat()*1+0.001*i,center.lng()*1+0.001*i);
		marker = new google.maps.Marker({
			position: latlng
		});
		markerArr.push(marker);
	}
	setMarker();
}

function setMarker(){
	if(markerArr){
		for(var i in markerArr){
			markerArr[i].setMap(map);
		}
	}
}

function hideMarker(){
	if(markerArr){
		for(var i in markerArr){
			markerArr[i].setMap(null);
		}
	}
}

	</script>
	
  </head>
  
  <body onload="initialize();">
  <div id="map_canvas" style="width: 1310px; height: 610px;float:left;"></div>
  <button onclick="setMarker();">显示标注</button>
  <button onclick="hideMarker();">隐藏标注</button>
  </body>
</html>